import LayoutWhite from "@/components/LayoutWhite";
import Title from "@/components/Title";
import Titles from "@/components/Titles";
// import city from "@/enums/city";
import { Button, Form, Input, message, Select } from "antd";
import { useState } from "react";
import { useTabsContext } from "@/contexts/TabsContext";
import { yuangongAdd } from "@/api/modules/yuangong";

const shopCar = () => {
	const [formVal, setFormVal] = useState<any>({});
	// const [userLen, setUserLen] = useState<number>(1);
	console.log(formVal);
	const { delTabs } = useTabsContext();
	console.log(delTabs);
	const [from] = Form.useForm();
	const onFinish = async (values: any) => {
		await yuangongAdd({
			code: 1,
			name: "啦啦啦",
			telephone: 17511438950,
			status: 0,
			imageUrl:
				"https://ts4.cn.mm.bing.net/th?id=ORMS.6d4285a3752d5df6b14d2f26dda6d835&pid=Wdp&w=268&h=140&qlt=90&c=1&rs=1&dpr=1&p=0"
		});
		message.success(JSON.stringify(values));
		setFormVal(values);
		delTabs("/staff/add");
	};

	const goBack = () => {
		delTabs("/staff/add");
	};

	// 拓展按钮 可传可不传
	const moreButton = () => {
		return "";
	};

	const submit = () => {
		from.submit();
	};

	return (
		<LayoutWhite>
			<Title word={"新增陪诊员工"} more={moreButton()} />
			<Form
				name="basic"
				form={from}
				labelCol={{ span: 8 }}
				wrapperCol={{ span: 8 }}
				style={{ width: "100%", padding: "20px 0px" }}
				initialValues={{ remember: true }}
				onFinish={onFinish}
				onFinishFailed={() => message.info("请输入必填项")}
				autoComplete="off"
			>
				<Titles title={"基本信息"} />
				<Form.Item label="陪诊id" name="code" rules={[{ required: true, message: "请输入人员编码" }]}>
					<Input placeholder="请输入人员编码" />
				</Form.Item>

				<Form.Item label="陪诊头像" name="name" rules={[{ required: true, message: "请输入人员名称" }]}>
					<Input placeholder="请输入人员名称" />
				</Form.Item>

				<Form.Item label="陪诊名称" name="name" rules={[{ required: true, message: "请输入人员名称" }]}>
					<Input placeholder="请输入人员名称" />
				</Form.Item>

				<Form.Item label="人员性别" name="name" rules={[{ required: true, message: "请选择用户性别" }]}>
					<Select
						placeholder="请选择人员性别"
						options={[
							{
								value: "0",
								label: "男"
							},
							{
								value: "1",
								label: "女"
							}
						]}
					></Select>
				</Form.Item>

				<Form.Item label="联系方式" name="name" rules={[{ required: true, message: "请输入人员名称" }]}>
					<Input placeholder="请输入人员名称" />
				</Form.Item>
			</Form>
			<Title word={""} more={moreButton()} />
			<div style={{ display: "flex", justifyContent: "center", alignItems: "center" }}>
				<Button style={{ marginRight: "30px" }} onClick={() => goBack()}>
					返回
				</Button>
				<Button type="primary" onClick={() => submit()}>
					确认保存
				</Button>
			</div>
		</LayoutWhite>
	);
};

export default shopCar;
